<template>
	<view>
		<view class="artisterPhoto artisterBox" style="min-height:150rpx;">
			<view class="flexbc">
				<span class="artisterInfoTitle">私密视频</span>
			</view>
			<view style="padding:10rpx;text-align:center;" v-if="UserVipVideos !== null">
				<view style="margin:20rpx;" v-for="(item,index) in UserVipVideos" :key="index">
					<video :src="item" style="width:100%;height:370rpx"></video>
				</view>
			</view>
		</view>


		<view class="artisterPhoto artisterBox" style="min-height:150rpx;">
			<view class="flexbc">
				<span class="artisterInfoTitle">私密相册（仅VIP会员可见）</span>
			</view>
			<view v-if="UserVipPhotos.length > 0">
				<view class="artVipPics" v-for="(item,index) in UserVipPhotos" :key="index">
					<view>{{ item.Label }}</view>
					<view class="artVipPic" v-for="(itm,idx) in item.Photos" :key="idx" @click="showPhoto(itm, idx)">
						<image :src="itm" mode="aspectFill"></image>
					</view>
				</view>
			</view>
			<view style="clear:both"></view>
		</view>

		<view class="artisterPhoto artisterBox" style="min-height:150rpx;">
			<view class="flexbc">
				<span class="artisterInfoTitle">我的优势</span>
			</view>
			<view style="padding-top:20rpx;" class="warpItem"
				v-if="ArtisterInfo.YoushiLabels && ArtisterInfo.YoushiLabels !== null">
				<view class="label" style="width:auto;padding-left:10rpx;padding-right:10rpx"
					v-for="(item,index) in JSON.parse(ArtisterInfo.YoushiLabels)" :key="index">
					{{ item.text }}
				</view>
				<view class="label" style="clear:both;width:auto;padding-left:10rpx;padding-right:10rpx"
					v-if="ArtisterInfo.OtherYoushi">{{ ArtisterInfo.OtherYoushi }}</view>
			</view>
		</view>

		<view class="artisterPhoto artisterBox" style="min-height:150rpx;">
			<view class="flexbc">
				<span class="artisterInfoTitle">自我介绍</span>
			</view>
			<view style="background-color:#f0f0f0;border:1rpx solid #e0e0e0;padding:15rpx;margin-top:30rpx;"
				v-if="ArtisterInfo.VipMemo">
				{{ ArtisterInfo.VipMemo }}
			</view>
		</view>
		<fui-gallery :urls="photoUrls" :show="photoShow" @hide="hideGallery" :current="currentIndex"></fui-gallery>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				ArtisterID: 0,
				ArtisterInfo: {},
				UserVipVideos: [],
				UserVipPhotos: [],
				UserYoushiLabels: [],
				photoUrls: [],
				photoShow: false,
				// 预览数组
				previewList: [],
				currentIndex: 0,
				ShowCount: 0
			};
		},
		onLoad(options) {
			uni.showToast({
				title: '浏览私密相册，消耗您10金币！',
				icon: 'none'
			})
			this.ArtisterID = options.artisterID;
			this.getArtister()
			wx.enableAlertBeforeUnload({
				message: "确定要退出私密空间吗？退出之后再次进入需要重新花费金币！",
			})
		},
		onShow() {
			// this.getArtister()
		},
		// onBackPress(options) {
		// console.log('options' , options.form)
		// },
		onUnload() {},
		methods: {
			showPhoto(item, index) {
				this.currentIndex = this.previewList.indexOf(item)
				// console.log(this.currentIndex)
				this.photoUrls = this.previewList;
				uni.previewImage({
					current: this.currentIndex,
					urls: this.photoUrls,
					showmenu: true,
				})
				// this.previewList = []
				// this.photoShow = true;
			},
			hideGallery() {
				this.photoShow = false;
			},
			goNavPage(url) {
				uni.navigateTo({
					url: url
				})
			},
			getArtister() {
				this.ShowCount = this.ShowCount + 1
				this.$httpost('/Artister/info', {
					ArtisterID: this.ArtisterID,
					ShowType: 'vip',
					ShowCount: this.ShowCount
				}).then(res => {
					// console.log('info', res)
					if (res.code == 200) {
						this.ArtisterInfo = res.data.ArtisterInfo;
						if (JSON.parse(res.data.ArtisterInfo.UserVipVideos) != null) {
							this.UserVipVideos = JSON.parse(res.data.ArtisterInfo.UserVipVideos);
						}
						if (JSON.parse(res.data.ArtisterInfo.UserVipPhotos) != null) {
							this.UserVipPhotos = JSON.parse(res.data.ArtisterInfo.UserVipPhotos);
							// console.log('his.UserVipPhotos ', this.UserVipPhotos )
							this.UserVipPhotos.forEach((item, index) => {
								this.previewList.push(...item.Photos)
							})

						}
						if (JSON.parse(res.data.ArtisterInfo.UserYoushiLabels) != null) {
							this.UserYoushiLabels = JSON.parse(res.data.ArtisterInfo.UserYoushiLabels);
						}

						// console.log(this.previewList);
					}
				})
			},
		}
	}
</script>

<style lang="scss">
	.artisterBox {
		height: auto;
		padding: 20rpx;
		background-color: #FFF;
		margin-top: 15rpx;
	}

	.artisterInfoTitle {
		font-weight: bold;
		font-size: 30rpx;
	}

	.label {
		// float:left;
		min-width: 120rpx;
		height: 50rpx;
		line-height: 50rpx;
		text-align: center;
		border: 1rpx solid #CCC;
		border-radius: 10rpx;
		font-size: 24rpx;
		margin: 10rpx;
	}

	.artVipPics {
		clear: both;
		// display: flex;
		// justify-content: space-between;
		margin-top: 10rpx;
	}

	.artVipPic {
		float: left;
		width: 28vw;
		height: 300rpx;
		background-color: #999;
		margin: 10rpx
	}

	.artVipPic image {
		width: 100%;
		height: 100%
	}

	.warpItem {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
	}
</style>